<?php
    $this->layout('base.phtml', [
        'title' => _('Importation from Pocket'),
        'canonical' => url_full('pocket'),
        'back_options' => [
            'track' => false,
        ],
        'has_errors' => $error || $errors,
    ]);
?>

<div class="section section--small section--longbottom">
    <div class="section__title">
        <h1><?= _('Importation from Pocket') ?></h1>
    </div>

    <p class="section__intro">
        <?= _f('%s enables you to import your links saved in Pocket.', get_app_configuration('brand')) ?>
    </p>

    <?= $this->include('alerts/_error.phtml', ['message' => $error]) ?>

    <?php if ($importation && $importation->status === 'ongoing'): ?>
        <p class="paragraph--featured" role="alert">
            <?= _('We’re importing your data from Pocket…') ?>
        </p>

        <div class="spinner"></div>

        <p class="paragraph--placeholder">
            <?= _('This might take several minutes, please wait.') ?>
        </p>

        <form
             method="get"
             action="<?= url('pocket') ?>"
             data-controller="autosubmit"
             data-autosubmit-mode-value="timeout"
             data-autosubmit-timeout-value="4000"
        >
        </form>
    <?php elseif ($importation && $importation->status === 'finished'): ?>
        <?= $this->include('alerts/_success.phtml', [
            'message' => _('We’ve imported your data from Pocket. You should see new links in your collections and/or bookmarks.')
        ]) ?>

        <form method="post" action="<?= url('delete importation', ['id' => $importation->id]) ?>">
            <input type="hidden" name="csrf" value="<?= csrf_token() ?>" />
            <input type="hidden" name="from" value="<?= url('pocket') ?>" />

            <div class="form__actions">
                <button type="submit" class="button--primary">
                    <?= _('Ok!') ?>
                </button>
            </div>
        </form>
    <?php elseif ($importation && $importation->status === 'error'): ?>
        <?= $this->include('alerts/_error.phtml', ['message' => protect($importation->error)]) ?>

        <form method="post" action="<?= url('delete importation', ['id' => $importation->id]) ?>">
            <input type="hidden" name="csrf" value="<?= csrf_token() ?>" />
            <input type="hidden" name="from" value="<?= url('pocket') ?>" />

            <div class="form__actions">
                <button type="submit" class="button--primary">
                    <?= _('Ok!') ?>
                </button>
            </div>
        </form>
    <?php elseif ($pocket_account && $pocket_account->access_token): ?>
        <form method="post" action="<?= url('import pocket') ?>">
            <input type="hidden" name="csrf" value="<?= csrf_token() ?>" />

            <div class="form-group" data-controller="caption-switcher">
                <input
                    type="checkbox"
                    id="import-bookmarks"
                    name="import_bookmarks"
                    checked
                    aria-describedby="import-bookmarks-caption"
                    data-action="caption-switcher#switch"
                    data-caption-switcher-target="switch"
                />

                <label class="label--checkbox" for="import-bookmarks">
                    <?= _('Import non-archived links in your bookmarks') ?>
                </label>

                <p class="form-group__caption form-group__caption--alt" id="import-bookmarks-caption" aria-live="polite">
                    <span data-caption-switcher-target="caption" data-caption-value="on">
                        <?= _f('%s will import your non-archived Pocket links in your bookmarks.', get_app_configuration('brand')) ?>
                    </span>

                    <span data-caption-switcher-target="caption" data-caption-unchecked>
                        <?= _f('%s will leave your bookmarks unchanged.', get_app_configuration('brand')) ?>
                    </span>
                </p>
            </div>

            <div class="form-group" data-controller="caption-switcher">
                <input
                    type="checkbox"
                    id="import-favorites"
                    name="import_favorites"
                    checked
                    aria-describedby="import-favorites-caption"
                    data-action="caption-switcher#switch"
                    data-caption-switcher-target="switch"
                />

                <label class="label--checkbox" for="import-favorites">
                    <?= _('Import your Pocket favorites in a dedicated collection') ?>
                </label>

                <p class="form-group__caption form-group__caption--alt" id="import-favorites-caption" aria-live="polite">
                    <span data-caption-switcher-target="caption" data-caption-value="on">
                        <?= _f('%s doesn’t provide favorites, but it’ll import them in a collection named “Pocket favorites”.', get_app_configuration('brand')) ?>
                    </span>

                    <span data-caption-switcher-target="caption" data-caption-unchecked>
                        <?= _f('%s doesn’t provide favorites, so they’ll be ignored.', get_app_configuration('brand')) ?>
                    </span>
                </p>
            </div>

            <div class="form__actions">
                <button type="submit" class="button--primary">
                    <?= _('Start the import') ?>
                </button>
            </div>
        </form>

        <p class="paragraph--centered paragraph--secondary">
            <small>
                <?= _f('connected with account <em>%s</em>', protect($pocket_account->username)) ?>
            </small>
        </p>
    <?php else: ?>
        <form method="post" action="<?= url('request pocket access') ?>" data-turbo="false">
            <input type="hidden" name="csrf" value="<?= csrf_token() ?>" />

            <div class="form__actions">
                <button type="submit" class="button--primary">
                    <?= _('Connect to Pocket') ?>
                </button>
            </div>
        </form>
    <?php endif; ?>
</div>
